<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<div id="app">
    <!--
         1.插值表达式引用data数据池数据是在标签体内
         2.如果是在标签/元素的属性上去引用data池里的数据，不能使用插值表达式
         3.需要使用v-bind,v-bind是vue来解析
         4.v-bind有简写形式 冒号
    -->
    <h1>欢迎你，{{message}}-{{name}}</h1>
    <!--<img v-bind:src="img_src" alt="" v-bind:width="img_width">-->
    <img :src="img_src" alt="" :width="img_width">
</div>
<!--引入vue.js-->
<script src="vue.js"></script>
<script>
    let vm=new Vue({
            el:"#app",  //创建的vue实例挂载到 id=app的div
            data:{  //data{} 数据池，有很多数据，以k-v形式设置(根据业务需求设置)
                message:"Hello-Vue!",
                name:"葛政",
                img_src:"./1.png",
                img_width:"200px"
            }
        })
</script>
</body>
</html>